import React, {Component} from 'react';
import {connect} from 'dva';
import {Spin} from 'antd';
import styles from '../../index.less';

const AppMenu = (WrappedComponent) => {
  @connect(state => ({
    user: state.user,
  }))
  class AppMenuInner extends Component {

    componentDidMount() {
      if (this.props.user.menus.length <= 0) {
        this.props.dispatch({
          type: 'user/fetchMenus',
        });
      }
    }

    render() {
      const menus = this.props.user.menus;
      const routerData = this.props.user.routerData;
      if (menus.length <= 0 || routerData.length <= 0) {
        return <Spin size="large" className={styles.globalSpin}/>;
      } else {
        return <WrappedComponent {...this.props} menus={menus} routerData={routerData} />;
      }
    }
  }

  return AppMenuInner;
};

export default AppMenu;
